<style lang="stylus" scoped>
@import '../styl/var.styl'

header
  display flex
  border-bottom solid 1px rgba(0, 0, 0, 0.04)
  justify-content space-between
  align-items center
  padding 0 20px 14px 23px
  margin-top 20px

  nav
    display flex
    align-items center

    a
      border-radius 8px
      margin-left 18px
      width 36px
      height 36px
      background 50% 50% / 30px no-repeat

      &.logout
        border-top 1px solid #eee

      &.home
        background-size 42px
        background-image url('!/svg/home.svg')

      &.msg
        background-image url('!/svg/msg.svg')

      &.user
        width 32px
        height 32px
        border-radius 16px
        background-size cover

      &:hover
        background-color bg

  .logo
    cursor default
    height 40px
    width 103px
    background url('!/svg/logo.svg') 0 0 / contain no-repeat
</style>

<template lang="pug">
header
  a.logo(href="#main")
  nav
    a.home(@click="home")
    a.msg
    a-dropdown
      a.user(:style="'background-image:url(' + ico + ')'")
      template(#content)
        a-doption(@click="set") 账号设置
        a-doption(@click="auto_update") 检测更新
        a-doption.logout(@click="logout") 退出登录
</template>

<script lang="coffee">
import user_ico from '!/svg/user.svg'
import {HTTP} from '@/config/site.coffee'
import ipc from '~/lib/ipc.coffee'

export default {
setup:=>
  {
    ico:shallowRef localStorage.ico or user_ico
    auto_update:=>
      ipc.auto_update.show()
      return
    set:=>
      ipc.open HTTP+'user_setting.html?user_token='+localStorage.uid
      return
    home:=>
      ipc.open HTTP+'video_library.html?user_token='+localStorage.uid
      return
    logout:=>
      ipc.camera.x()
      delete localStorage.uid
      delete localStorage.record
      ipc.close('show')
      location.reload()
      return
  }
}
</script>
